/*
 * Metro UI CSS
 * Copyright 2012 Sergey Pimenov
 * Licensed under the MIT License
 *
 * Tables.less
 *
 */

table {
    width: 100%;
    border-collapse: separate;
    margin: 0 0 20px;

    thead {
        tr {
            th, td {
                display: table-cell;
                vertical-align: bottom;
                padding-bottom: @subunit;
                padding-top: @subunit * 2;
                padding-left: @subunit;
                border-bottom: 1px #ddd solid;
                border-right: 1px #ddd solid;
                border-left: 1px transparent solid;
                border-top: 1px transparent solid;
                #font > .navigation;
                .text-rest2-state;
                text-align: left;

                &.right {
                    text-align: right;
                    padding-right: @subunit * 2;
                }

                &.last {
                    border-right: 1px transparent solid;
                }

                &:last-child {
                    border-right: 1px transparent solid;
                }
            }
        }
    }

    tbody {
        tr {
            border: 1px #fff solid;

            td {
                #font > .normal;
                padding: 3px 10px;
                border-right: 1px #ddd solid;
                border-bottom: 1px #ddd solid;
                border-left: 1px transparent solid;
                border-top: 1px transparent solid;
                box-sizing: border-box;

                &.right {
                    text-align: right;
                }
                &.center {
                    text-align: center;
                }
                &.last {
                    border-right: 1px transparent solid;
                }
                &:last-child {
                    border-right: 1px transparent solid;
                }
            }

            &.success {
                .bg-color-green;
            }
            &.error {
                .bg-color-red();
            }
            &.warning {
                .bg-color-orange();
            }
            &.info {
                .bg-color-blue();
            }

            &.info, &.warning, &.error, &.success {
                td {
                    .fg-color-white;
                }
            }

            &.selected-row {
                background-color: rgba(28, 183, 236, 0.10) !important;
                td:first-child {
                    border-left: 1px #1c98cc solid;
                }
                td:last-child {
                    border-right: 1px #1c98cc solid;
                }
                td {
                    border-top: 1px #1c98cc solid;
                    border-bottom: 1px #1c98cc solid;
                }
            }
        }
    }

    tfoot {
    }

    &.striped {
        tbody {
            tr:nth-child(odd) {
                background-color: #f9f9f9;
            }
        }
    }

    &.hovered {
        border-collapse: separate !important;
        thead {
            tr {
                th,td {
                    &:hover {
                        border: 1px #1c98cc solid;
                        background: rgba(28, 183, 236, 0.10);
                    }
                }
            }
        }

        tbody {
            tr {
                &:hover {
                    background-color: rgba(28, 183, 236, 0.10);
                    td:first-child {
                        border-left: 1px #1c98cc solid;
                    }
                    td:last-child {
                        border-right: 1px #1c98cc solid;
                    }
                    td {
                        border-top: 1px #1c98cc solid;
                        border-bottom: 1px #1c98cc solid;
                    }
                }
            }
        }
    }

    &.bordered {
        border-collapse: separate !important;
        border: 1px #ccc solid !important;

        tbody {
            tr:last-child {
                td {
                    border-bottom: 0;
                }
            }
        }
    }

}

